<template lant="html">
  <div class="">
    star组件

    <i class="glyphicon" :style="fontSize" :class="item" v-for="item in stars"></i>
  </div>
</template>

<script>
  export default {
    components: {},
    props: {
      score: {
        type: Number,
      },
      size: {
        type: Number,
      }
    },
    data(){
      return {
        stars: [],
        fontSize:{}
      }
    },
    mounted(){
      let arr = [];
      for (let i = 0; i < this.score; i++) {
        arr.push('glyphicon-star')
      }
      for (let i = 0; i < 5 - this.score; i++) {
        arr.push("glyphicon-star-empty ")
      }
      this.stars = arr;
      this.fontSize={'font-size':this.size+'px'}
      console.log(this.fontSize)

    }
  }
</script>
<style lang="css">

</style>
